<link rel="stylesheet" href="./css/fractionslider.css" type="text/css" media="screen" />

<!-- banner -->
<div class="banner">
	<div class="slider"><!-- your slider container -->
		<div class="slide">
			<img src="img/banner-01.jpg" data-fixed data-position="0,0" data-in="fade" data-step="1" data-delay="0" data-out="left" class="img-background">
			<img src="img/img-01.jpg" data-position="50,1090" data-in="left" data-delay="100" data-step="1" data-out="left">
			<img src="img/img-02.jpg" data-position="250,1090" data-in="left" data-delay="300" data-step="2" data-out="bottomRight">
			
			<p class="text-desc-bn-title" data-position="100,90" data-in="top" data-step="1" data-out="top"><a href="#">ETD Precision Ceramics Corporation </a></p>
			<p class="text-desc-bn" data-position="150,90" data-in="top" data-step="2" data-out="left">provides quality machining and grinding services on Ceramics, Quartz, and Other Materials</p>
		</div>
		<div class="slide">
			<img src="img/banner-01.jpg" data-fixed data-position="0,0" data-in="fade" data-step="1" data-delay="0" data-out="left" class="img-background">
			<img src="img/img-02.jpg" data-position="250,1090" data-in="left" data-delay="100" data-step="1" data-out="bottomRight">
			<img src="img/img-01.jpg" data-position="50,1090" data-in="left" data-delay="300" data-step="2" data-out="left">
			
			<p class="text-desc-bn-title" data-position="100,90" data-in="top" data-step="1" data-out="top"><a href="#">ETD Precision Ceramics Corporation </a></p>
			<p class="text-desc-bn" data-position="150,90" data-in="right" data-step="2" data-out="bottom">provides quality machining and grinding services on Ceramics, Quartz, and Other Materials</p>
		</div>
	</div>
</div>
<!-- banner .end -->

<script type="text/javascript" src="./js/jquery.fractionslider.min.js"></script>
<script type="text/javascript" src="./js/fractionslider.js"></script>